<template>
  <view class="wrapper row">
    <block v-if="loginFlag">
      <view class="search row flex-center pd_l_30 pd_r_30" style="justify-content: space-between;">
        <u-input v-model="queryform.schoolName" class="flex-1 fon4-24 pd_l_30 pd_r_30"
                 confirm-type="search"
                 :clearable="false"
                 @confirm="search"
                 :height="50" placeholder="请输入院校名称进行搜索"/>
        <view class="btn color-active" @click="search">搜索</view>
      </view>
      <view class="dropdown yh_bd_bottom row">
        <view class="flex-1">
          <drop-menu :options="options" @choose="chooseBack" :title_size="28"></drop-menu>
        </view>
      </view>
      <view class="flex-1 main row">
        <scroll-view scroll-y style="height: 100%">
          <u-cell-group>
            <u-cell-item use-label-slot v-for="(item, index) in list"
                         v-if="item.schoolName && !item.isHidden"
                         :arrow="false" :key="index"
                         :index="index"
                         @click="toDetail(item)">
              <view slot="label" class="row label">
                <image :src="item.imgUrl" class="icon pd_t_20" v-if="item.imgUrl" lazy-load @error="loadError"/>
                <u-icon name="photo" v-if="!item.imgUrl" size="110"></u-icon>
                <view class="right pd_l_30">
                  <view class="title font-b color-333 font-32 pd_b_10">{{item.schoolName}}</view>
                  <view class="font-24 color-999 pd_b_10">所在地：{{item.provinceName}}  学历层次：{{item.uorS || ''}}</view>
                  <view class="row pd_b_10">
                    <view class="school_tag font-20 school_tag_0" v-if="item.schoolType">{{item.schoolType == null ? '' : item.schoolType}}</view>
                    <view class="school_tag font-20"
                          :class="{
                            'school_tag_1': indexs == 0,
                            school_tag_2: indexs == 1,
                            school_tag_3: indexs == 2,
                            school_tag_4: indexs == 3,
                            school_tag_5: indexs == 4,
                            school_tag_6: indexs == 5,
                            school_tag_6: indexs == 6,
                          }"
                          :index="indexs"
                          :key="indexs"
                          v-for="(items, indexs) in item.typeId" v-if="items != '-'">{{items}}</view>
                  </view>
                  <view class="font-24">预估最低分位次：<text class="color-active u-font-lg font-b">{{item.lowestForecast}}</text></view>
                </view>
              </view>
            </u-cell-item>
          </u-cell-group>
          <u-empty text="暂无数据" mode="search" v-if="!list.length && !loadStatus"></u-empty>
          <view style="text-align: center;height: 500rpx;line-height: 500rpx" v-if="loadStatus">
            <u-loading mode="flower" size="50"></u-loading>
          </view>
        </scroll-view>
      </view>
    </block>
    <view v-else style="height: 100%">
      <go_login></go_login>
    </view>
  </view>
</template>

<script>
  import {request} from "../../util/api"
  import dropMenu from '@/components/my_dropmenu/index'
  import go_login from "../../components/go_login"
  import mixins from "./mixins"
  import {getCurrentFullPath} from "../../util/util";

  export default {
    mixins: [mixins],
    components: {
      dropMenu,
      go_login
    },

    data() {
      return {
        customStyle: {
          background: '#FF8B37',
          marginRight: '20px'
        },
        queryform: {
          pageSize: 15,
          pageNum: 1
        },
        form: {
          firstSubject: '物理',
          provinceName: '重庆',
          specialtyName: '经济学',
          userOrder: '11',
          uOrS: '本科'
        },
        list: [],
        options: ['provinceName', 'schoolType', 'typeIds', 'uOrS'],
        loadStatus: true,
        specialtyCode: ''
      }
    },

    onLoad(option) {
      this.form = JSON.parse(option.data)
      this.specialtyCode = option.c
      this.getList()
    },

    methods:{
      toDetail(item) {
        let {year1, lowestOrder1, year2, year3, year4, lowestOrder2, lowestOrder3, lowestOrder4,
          lowestScore1, lowestScore2, lowestScore3, lowestScore4, forecastYear, lowestForecast,
            schoolName, id
        } = item
        let renderData = {
          year1, lowestOrder1, year2, year3, year4, lowestOrder2, lowestOrder3, lowestOrder4,
          lowestScore1, lowestScore2, lowestScore3, lowestScore4, forecastYear, lowestForecast,schoolName, id
        }
        this.$u.route({
          url: `/pages/explore/fill_details?render=${JSON.stringify(renderData)}&data=${JSON.stringify(this.form)}&c=${this.specialtyCode}`
        })
      },

      chooseBack(res) {
        this.list.forEach(item => {
          var isHidden = false
          if (item.schoolName) {
            if (res.provinceName && res.provinceName != item.universityProvinceName) {
              isHidden = true
            }
            if (res.schoolType && res.schoolType != item.schoolType) {
              isHidden = true
            }
            if (res.typeIds && !item.typeId.includes(res.typeIds)) {
              isHidden = true
            }
            if (res.uOrS && res.uOrS != item.uorS) {
              isHidden = true
            }
          }
          this.$set(item, 'isHidden', isHidden)
        })
      },

      getList() {
        this.loadStatus = 'loading'
        request({
          url: '/system/wx/CompassSimulateFill/list',
          token: true,
          data: this.form,
          platfom: 'weixin'
        }).then(res => {
          res.data.forEach(item => {
            if (item.schoolName) {
              item.typeId = item.typeIds.replace(/^\s+|\s+$/g, '').split(" ")
            }
          })
          if (res.data.length) {
            this.list = res.data.sort(this.compare('lowestForecast'))
          } else {
            this.list = res.data
          }
          this.loadStatus = false
        })
      },

      search() {
        this.list.forEach(item => {
          var isHidden = false
          if (item.schoolName) {
            if (this.queryform.schoolName && !item.schoolName.includes(this.queryform.schoolName)) {
              isHidden = true
            }
          }
          this.$set(item, 'isHidden', isHidden)
        })
      },

      loadError(e) {

      },

      compare(property){
        return function(a,b){
          var value1 = a[property];
          var value2 = b[property];
          return value1 - value2;
        }
      }
    },

    onShareAppMessage(res) {
      return {
        path: getCurrentFullPath()
      }
    }
  }
</script>

<style scoped lang="scss">
  .wrapper {
    flex-direction: column;
    height: 100%;
    .search {
      width: 100%;
      background: rgba(249, 249, 249, 100);
      padding-top: 20upx;
      padding-bottom: 20upx;

      .flex-1 {
        background: #fff;
        border-radius: 25upx;
        margin-right: 20upx;
      }
    }
    .main {
      height: 100%;
      .label {
        .icon {
          width: 110upx;
          height: 110upx;
        }
      }
    }
  }
</style>
